<template>
	<view>
		<view class="m-card u-m-t-20">
			<view class="u-flex u-flex-y-center">
				<u-image width="4" height="22" :src="oss + '/mine/shu.png'">
				</u-image>
				<text class="u-m-l-10 u-font-32 m-font-b">{{ title }}</text>
			</view>
			<view class="u-m-t-20">
				<view class="u-flex u-flex-items-stretch u-font-24">
					<u-image width="100" height="100" :src="paramsObj.images.split(',')[0]">
					</u-image>
					<view class="list-stretch u-m-l-20 u-flex-1">
						<view class="m-font-b u-font-32">{{ paramsObj.properties_name }}</view>
						<view class="u-flex m-c-h">
							<text>{{ paramsObj.bedroom }}室{{ paramsObj.room }}厅/{{ paramsObj.area }}m</text>
							<text class="m-pf">2</text>
							<text>/{{ paramsObj.orientation }}</text>
						</view>
						<text class="m-c-o" v-if="paramsObj.price">{{paramsObj.duration?'租金':'售价'}}：{{ parseInt(paramsObj.price) }}元</text>
						<text class="m-c-o" v-if="paramsObj.duration">租期：{{ paramsObj.duration }}</text>
						<view class="u-flex u-flex-x-reverse" v-else  @click="nextNav('/pages/mine/xiangxi?id=' + paramsObj.id + '&type=1')">
							<u-icon name="arrow-right" size="12" color="#acacac"></u-icon>
							<text class="m-c-h">查看更多情况</text>
						</view>
					</view>
				</view>
				<view class="u-flex u-flex-x-reverse u-m-t-30">
					<view class="item-btn u-flex u-flex-center" v-for="(item, index) in btns" :key="index"
						:class="index === btns.length - 1 ? 'item-btn-on u-m-l-0' : 'u-m-l-10'" @click="nextNav(item.url)">
						<u-icon :name="item.icon" size="18"></u-icon>
						<view class="u-m-l-10 u-font-24">{{ item.name }}</view>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		name: 'list-item',
		data() {
			return {};
		},
		props: {
			title: {
				type: String,
				default: '标题'
			},
			paramsObj: {
				type: Object,
				default: {}
			},
			btns: {
				type: Array,
				default: () => []
			}
		}
	};
</script>

<style lang="scss">
	.item-btn {
		border: 2rpx solid #dcdccd;
		color: #5a5a5a;
		border-radius: 10rpx;
		height: 50rpx;
		line-height: 50rpx;
		padding: 0 15rpx;
	}

	.item-btn-on {
		border-color: #d37a38 !important;
		color: #d37a38 !important;
	}
</style>
